<template>
  <div class="contain-body hdda-box">
    <Title></Title>
    <div class="search-contain-body">
      <el-form ref="form"
               inline
               :model="form"
               label-width="75px">
        <el-form-item>
          <div class="d-ib font-table"
               slot="label">活动名称：</div>
          <el-input v-model="form.hdmcs"></el-input>
        </el-form-item>

        <el-form-item>
          <div class="d-ib font-table"
               slot="label">活动地点：</div>
          <el-input v-model="form.hddds"></el-input>

        </el-form-item>

        <el-form-item>
          <el-button icon="el-icon-search"
                     class="button-search"
                     @click="onSubmit">搜索</el-button>
        </el-form-item>
      </el-form>

    </div>
    <div>
      <div class="pos-r">
        <Title msg="信息列表"></Title>
        <div class="pos-a" style="right: 0">
          <el-button @click="openOptions('','add')" type="primary" icon="el-icon-plus">
            新增
          </el-button>
        </div>
      </div>
      <CustomTable :columns="columns"
                   :table-data="tableData"
                   :pagination="pagination"
                   @pagination="paginationChange"
                   :total="total">
        <div slot="options"
             slot-scope="scope">
          <el-button @click="openOptions(scope,'details')" style="margin-left: 4px;" class="button-blur">详情</el-button>
          <el-button @click="openOptions(scope,'edit')" style="margin-left: 4px;" class="button-green">编辑</el-button>
          <el-button @click="deleteDate(scope)" style="margin-left: 4px;" class="button-red">删除</el-button>
        </div>
      </CustomTable>
    </div>

    <el-dialog width="819px"
               center
               class="custom-dialog-fill font-table"
               title="活动审批"
               :visible.sync="dialog.open">

      <div class="dialog-title"
           slot="title">
        {{ dialog.title }}
      </div>

      <div class="d-f jc-c">

        <el-form class="font-table"
                 style="color: #000000;"
                 ref="form"
                 :model="form"
                 :disabled="flag"
                 label-width="75px">
          <div class="mb-14"><b>基本信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">活动编号：</div>
            <el-input v-model="form.hdbh" style="width: 35%"></el-input>
            <div  class="d-ib font-table" slot="" style="margin-left: 40px">活动名称：</div>
            <el-input prop="hdmc"  v-model="form.hdmc" style="width: 35%"></el-input>
          </el-form-item>

          <el-form-item>
            <div class="d-ib font-table" slot="label">活动类型：</div>
            <el-select v-model="form.hdlx" style="width: 35%" placeholder="请选择">
              <el-option label="娱乐" value="0"></el-option>
              <el-option label="特色" value="1"></el-option>
              <el-option label="大型集会" value="2"></el-option>
            </el-select>
            <div class="d-ib font-table" slot="" style="margin-left: 13.5%">人数：</div>
            <el-input v-model="form.rs" style="width: 35%"></el-input>
          </el-form-item>

          <el-form-item>
            <div class="d-ib font-table" slot="label">场馆编号：</div>
            <el-input v-model="form.cgBh" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 40px">地址名称：</div>
            <el-input v-model="form.cgDzmc" style="width: 35%"></el-input>
          </el-form-item>

          <el-form-item>
            <div class="d-ib font-table" slot="label">活动内容：</div>
            <el-input v-model="form.hdnr" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 40px">活动日程：</div>
            <el-input v-model="form.hdrc" style="width: 35%"></el-input>
          </el-form-item>

          <el-form-item>
            <div class="d-ib font-table" slot="label">用户编号：</div>
            <el-input v-model="form.yhxxYhbh" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 40px">用户姓名：</div>
            <el-input v-model="form.yhxxXm" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item>
            <div class="d-ib font-table" slot="" style="margin-left: -19%">活动日程编号：</div>
            <el-input v-model="form.hdrcbh" style="width: 35%"></el-input>
          </el-form-item>

          <div class="mb-14"><b>举办信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">主办单位：</div>
            <el-input v-model="form.jbxxZbdw" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 40px">承办单位：</div>
            <el-input v-model="form.jbxxCbdw" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item>
            <div class="d-ib font-table" slot="label">日期时间：</div>
            <el-date-picker type="datetime" placeholder="选择日期" v-model="form.jbxxRqsj"
                            style="width: 35%" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
            <div class="d-ib font-table" slot="" style="margin-left: 40px">地点名称：</div>
            <el-input v-model="form.jbxxDdmc" style="width: 35%"></el-input>
          </el-form-item>

          <div class="mb-14"><b>申请信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">日期时间：</div>
            <el-date-picker type="datetime" placeholder="选择日期" v-model="form.sqxxRqsj"
                            style="width: 35%" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
            <div class="d-ib font-table" slot="" style="margin-left: 13.5%">姓名：</div>
            <el-input v-model="form.sqxxXm" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item>
            <div class="d-ib font-table" slot="label">状态：</div>
            <el-radio v-model="form.sqxxZt" label="0">已申请</el-radio>
            <el-radio v-model="form.sqxxZt" label="1">未申请</el-radio>
          </el-form-item>

          <div class="mb-14"><b>审批信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">日期时间：</div>
            <el-date-picker type="datetime" placeholder="选择日期" v-model="form.spxxRqsj"
                            style="width: 35%" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
            <div class="d-ib font-table" slot="" style="margin-left: 13.5%">姓名：</div>
            <el-input v-model="form.spxxXm" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item>
            <div class="d-ib font-table" slot="label">意见：</div>
            <el-radio v-model="form.spxxYj" label="0">同意</el-radio>
            <el-radio v-model="form.spxxYj" label="1">不同意</el-radio>
            <!--<el-input v-model="form.spxxYj" style="width: 35%"></el-input>-->
            <div class="d-ib font-table" slot="" style="margin-left: 13%">状态：</div>
            <el-radio v-model="form.spxxZt" label="0">已审批</el-radio>
            <el-radio v-model="form.spxxZt" label="1">未审批</el-radio>
            <el-radio v-model="form.spxxZt" label="2">审批中</el-radio>
          </el-form-item>
          <div class="mb-14"><b>活动安保单位信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">单位名称：</div>
            <el-input v-model="form.hdabdwxxDwmc" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 2.5%">公安机关机构：</div>
            <el-input v-model="form.hdabdwxxGajgjgdm" style="width: 35%"></el-input>
          </el-form-item>
          <div class="mb-14"><b>联系人信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">姓名：</div>
            <el-input v-model="form.lxrxxXm" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 40px">联系电话：</div>
            <el-input v-model="form.lxrxxLxdh" style="width: 35%"></el-input>
          </el-form-item>
          <div class="mb-14"><b>活动参与人员</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">类型：</div>
            <el-input v-model="form.cyryLx" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 13.5%">编号：</div>
            <el-input v-model="form.cyryBh" style="width: 35%"></el-input>
          </el-form-item>
          <div class="mb-14"><b>活动任务</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">类型：</div>
            <el-input v-model="form.hdrwLx" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 13.5%">编号：</div>
            <el-input v-model="form.hdrwBx" style="width: 35%"></el-input>
          </el-form-item>

          <div class="mb-14"><b>售票信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="" style="margin-left: -19%">可发售票总数：</div>
            <el-input v-model="form.spxxKfszs" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="">实际发售票总数：</div>
            <el-input v-model="form.spxxSjfspzs" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item>
            <div class="d-ib font-table" slot="" style="margin-left: -27.5%">实际入场购票人总数：</div>
            <el-input v-model="form.spxxSjrcgprs" style="width: 35%"></el-input>
          </el-form-item>

          <div class="mb-14"><b>制证信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="" style="margin-left: -14%">可制证总数：</div>
            <el-input v-model="form.zzxxKzzzs" style="width: 32%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 3%">实际制证总数：</div>
            <el-input v-model="form.zzxxSjzzzs" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item>
            <div class="d-ib font-table" slot="" style="margin-left: -27.5%">实际入场持证人总数：</div>
            <el-input v-model="form.zzxxSjrcczrzs" style="width: 35%"></el-input>
          </el-form-item>

          <div class="mb-14"><b>活动日志信息</b></div>
          <el-form-item>
            <div class="d-ib font-table" slot="label">日志编码：</div>
            <el-input v-model="form.hdrzxxRzbm" style="width: 35%"></el-input>
            <div class="d-ib font-table" slot="" style="margin-left: 40px">日志名称：</div>
            <el-input v-model="form.hdrzxxRzmc" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item>
            <div class="d-ib font-table" slot="label">日志详述：</div>
            <el-input type="textarea" v-model="form.hdrzxxRzxs" style="width: 91.5%"></el-input>
          </el-form-item>
        </el-form>



      </div>
      <div class="d-f jc-c">
        <div v-if="dialog.type=='add'">
          <el-button
                  class="button-cancel"
                  @click="dialog.open = false">取 消
          </el-button>
          <el-button
                  class="button-submit mr58"
                  @click="add()">确 定
          </el-button>
        </div>
        <div v-if="dialog.type=='edit'">
          <el-button
                  class="button-cancel"
                  @click="dialog.open = false">取 消
          </el-button>
          <el-button
                  class="button-submit mr58"
                  @click="edit()">确 定
          </el-button>
        </div>

        <div v-if="dialog.type=='details'">
          <el-button
                  class="button-cancel"
                  @click="dialog.open = false">关  闭
          </el-button>
        </div>
      </div>
    </el-dialog>

  </div>
</template>

<script>
    import Title from "../../../components/Title";
    import CustomTable from "../../../components/CustomTable";

    export default {
        name: "jbxx",
        components: { Title, CustomTable },
        data () {
            return {
                flag:false,
                total: 0,
                pagination: {},

                dialog: {
                    title: '新增方案',
                    open: false,
                    type: 'add',//'edit','add','details'
                },
                form: {
                    xm: ''
                },
                tableData: [

                ],
                columns: [
                    {
                        key: 'hdmc',
                        label: '活动名称'
                    },
                    {
                        key: 'jbxxRqsj',
                        label: '活动时间',
                        width:'200px'

                    },
                    {
                        key: 'jbxxDdmc',
                        label: '活动地点'
                    },
                    {
                        key: 'jbxxZbdw',
                        label: '举办单位'
                    },
                    {
                        key: 'rs',
                        label: '活动规模'
                    },
                    {
                        key: 'lxrxxLxdh',
                        label: '联系电话'
                    },
                    {
                        key: 'options',
                        label: '操作',
                        width: '240px',
                        slot: true
                    }
                ],
            }
        },
        mounted () {
        },
        methods: {
            paginationChange (e) {
                this.pagination = e;
                this.getList(this.pagination.pageNum, this.pagination.pageSize);
            },
            getList (page, limit) {
                this.axios.post('/dxhd-activity/selectPage', {
                    current: page,
                    size: limit,
                    entity: {
                        hdmc: this.form.hdmcs || '',
                        jbxxDdmc: this.form.hddds || ''
                    }
                }).then((res) => {
                    //列表
                    this.tableData = res.data.records;
                this.total = res.data.total;
            }).catch((error) => {
                    console.log(error);
            });
            },
            onSubmit () {
                this.getList(this.pagination.pageNum, this.pagination.pageSize);
            },
            openOptions (scope,params) {
                console.info(scope);
                this.dialog.type = params
                if (params == 'add') {
                    this.flag=false;
                    this.dialog.title = '新增';
                    this.form={}
                }
                if (params == 'edit') {
                    this.flag=false;
                    this.dialog.title = '编辑'
                    this.form=scope.data;
                }
                if (params == 'details') {
                    this.flag=true;
                    this.dialog.title = '详情'
                    this.form=scope.data;
                }
                this.dialog.open = true
            },


            //根据id删除
            getDetail(id) {
                this.axios.post('/dxhd-activity/removeById', {
                    hdbh: id || 4588988
                }).then((res) => {
                    this.$message({
                    type: 'success',
                    message: '删除成功!'
                });
                this.onSubmit();
            }).catch((error) => {
                    this.$message({
                    type: 'info',
                    message: '删除失败'
                });
            });
            },
            add(){
                this.axios.post('/dxhd-activity/save', this.form).then((res) => {
                    this.$message({
                    type: 'success',
                    message: '保存成功!'
                });
                this.dialog.open = false
                this.onSubmit();

            }).catch((error) => {
                    this.$message({
                    type: 'info',
                    message: '保存失败'
                });
            });
            },

            edit(){
                this.axios.post('/dxhd-activity/updateById', this.form).then((res) => {
                    this.$message({
                    type: 'success',
                    message: '保存成功!'
                });
                this.dialog.open = false

            }).catch((error) => {
                    this.$message({
                    type: 'info',
                    message: '保存失败'
                });
            });
            },

            deleteDate(row) {
                this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '关闭',
                    type: ''
                }).then(() => {
                    this.getDetail(row.data.hdbh);
                this.onSubmit();
            }).catch(() => {
                    this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
            }


        }
    }
</script>

<style lang="scss">
  .hdda-box {
    .mb-14 {
      margin-bottom: 14px;
    }

    .mr111 {
      margin-right: 111px;
    }

    .mr58 {
      margin-right: 58px;
    }
    .input {
      width: 205px !important;
    }
  }
</style>



